<div class="page-breadcrumbs">
    <ul class="breadcrumb">
        <li>
            <i class="fa fa-home"></i>
            <a href="#">Home</a>
        </li>
        <li>
            <a href="#">系统设置</a>
        </li>
        <li>
            <a href="#!system/menu/menu-index.html">菜单管理</a>
        </li>
        <li class="active">菜单添加</li>
    </ul>
</div>
<!-- Page Body -->
<div class="page-body">
    <div class="row">
        <div class="col-xs-12 col-md-12">
            <div class="widget">
                <div class="widget-header bordered-bottom bordered-themeprimary">
                    <i class="widget-icon fa fa-tasks themeprimary"></i>
                    <span class="widget-caption themeprimary">菜单基本信息</span>
                </div>
                <div class="widget-body">
                    <div class="form-horizontal bv-form" novalidate="novalidate">
                        <form id="editForm">
                            <div class="form-group has-feedback">
                                <label class="col-lg-2 control-label">菜单名称</label>
                                <div class="col-lg-9">
                                    <input type="text" class="form-control" name="name" data-bv-field="name"><i class="form-control-feedback" data-bv-field="name" style="display: none;"></i>
                                </div>
                            </div>
                            <div class="form-group has-feedback">
                                <label class="col-lg-2 control-label">菜单编号</label>
                                <div class="col-lg-9">
                                    <input type="text" class="form-control" name="code" data-bv-field="code"><i class="form-control-feedback" data-bv-field="code" style="display: none;"></i>
                                </div>
                            </div>
                            <div class="form-group has-feedback">
                                <label class="col-lg-2 control-label">请求地址</label>
                                <div class="col-lg-9">
                                    <input type="text" class="form-control" name="url" data-bv-field="url"><i class="form-control-feedback" data-bv-field="url" style="display: none;"></i>
                                </div>
                            </div>
                            <div class="form-group has-feedback">
                                <label class="col-lg-2 control-label">菜单类型</label>
                                <div class="col-lg-9">
                                    <select class="form-control" name="menuDef" data-bv-field="menuDef">
                                        <option value="">请选择菜单类型</option>
                                        <option value="BASE_DATA_MANAGE">基础菜单</option>
                                        <option value="LOG_DATA_MANAGE">日志菜单</option>
                                    </select><i class="form-control-feedback" data-bv-field="menuDef" style="display: none;"></i>
                                </div>
                            </div>
                            <div class="form-group has-feedback">
                                <label class="col-lg-2 control-label">上级菜单</label>
                                <div class="col-lg-9">
                                    <input type="hidden" class="form-control" id="parentId" name="parentId">
                                    <input type="text" class="form-control" id="parentName" name="parentName" onclick="javascript:menuParent();">
                                </div>
                            </div>
                            <div class="form-group has-feedback">
                                <label class="col-lg-2 control-label">备注</label>
                                <div class="col-lg-9">
                                    <textarea class="form-control" rows="5" name="note"></textarea>
                                </div>
                            </div>
                        </form>
                        <div class="form-group">
                            <div class="col-lg-8 col-lg-offset-4">
                                <button class="btn btn-blue" id="saveAdd">保存</button>
                                <button class="btn btn-default" id="cancel">取消</button>
                            </div>
                        </div>
                        <div/>
                    </div>
                </div>
            </div>
        </div>

        <div id="menuParentDialog" style="display:none;">
            <div class="row" style="margin: 15px;">
                <div class="col-md-12">
                    <ul id="menuTree" class="row ztree"></ul>
                </div>
            </div>
        </div>

    </div>
    <script type="application/javascript">
        var selectTreeNode = null;
        var setting = {
            async: {
                enable: true,
                url:"rest/v1/sys/menu/BASE_DATA_MANAGE/childs",
                autoParam:["id=parenId"],
                dataType: "json",
                type: "get",
                dataFilter: filter
            },
            callback: {
                beforeClick: beforeClick
            }
        };

        function filter(treeId, parentNode, childNodes) {
            if (!childNodes) return null;
            for (var i=0, l=childNodes.length; i<l; i++) {
                childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.');
            }
            return childNodes;
        }

        function beforeClick(treeId, treeNode) {
            selectTreeNode = treeNode;
            /*if (!treeNode.isParent) {
                alert("请选择父节点");
                return false;
            } else {
                return true;
            }*/
        }

        $(function(){
            $('#saveAdd').click(function(e){
                var data = $('#editForm').data('bootstrapValidator');
                if (data) {
                    data.validate();
                    if (data.isValid()) {
                        $.ajax({
                            type : "post",
                            url : "rest/v1/sys/menu",
                            contentType: 'application/json',
                            data: JSON.stringify($('#editForm').serializeJson()),
                            dataType: 'json',
                            success: function (response) {
                                Notify(response.message, 'top-right', '800', 'success', 'fa-bolt', true);
                                window.history.go(-1);
                            },
                            error: function(error) {
                                var obj = jQuery.parseJSON(error.responseText);
                                Notify(obj.message, 'top-right', '800', 'warning', 'fa-bolt', true);
                            }
                        });
                    }
                }
            });

            $('#cancel').click(function(e){
                window.history.go(-1);
            });

            $('#editForm').bootstrapValidator({
                excluded: [':disabled'],
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    name: {
                        validators: {
                            notEmpty: {
                                message: '菜单名称不能为空'
                            }
                        }
                    },
                    code: {
                        validators: {
                            notEmpty: {
                                message: '菜单编号不能为空'
                            }
                        }
                    },
                    menuDef: {
                        validators: {
                            notEmpty: {
                                message: '菜单类型不允许为空'
                            }
                        }
                    }
                }
            });
        });

        function menuParent(){
            $.fn.zTree.init($("#menuTree"), setting);
            layer.open({
                area: ['500px', '650px'],
                type: 1,
                title:'选择上级菜单',
                content: $('#menuParentDialog'),
                btn: ['选择','取消'],
                yes: function(index, layero){
                    if(null != selectTreeNode){
                        $('#parentId').val(selectTreeNode.id);
                        $('#parentName').val(selectTreeNode.name);
                        layer.close(index);
                    }else{
                        Notify('请选择菜单', 'top-right', '800', 'warning', 'fa-bolt', true);
                    }
                },cancel: function(){
                    layer.close(index);
                }
            });
        }
    </script>